<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<script type="text/javascript">
  function page(n,s){
    $("#pageNo").val(n);
    $("#pageSize").val(s);
    $("#searchForm").submit();
    return false;
  }
</script>
<div class="app">
  <div class="layout">
    <section class="main-content col-lg-3">
      <div class="content-wrap" id="leftCenterDiv">
        <div class="wrapper" style="bottom: 50px;">
          <ul class="nav nav-tabs">
            <li class="active">
              <a href="#" onclick="loadDiv('mainCenterDiv','${ctx}/csm/expNameDict/index')">消耗品名称字典</a>
            </li>
          </ul>

          <%--左侧消耗品字典列表--%>
          <section class="panel panel-default">
            <div class="panel-body">
              <div class="table-responsive no-border">
                <div class="datatable-top">
                  <div class="pull-left">
                    <%--消耗品查询--%>
                    <form:form id="searchFormDict" modelAttribute="expNameDict"
                               onsubmit="return loadDivForm('mainCenterDiv','searchFormDict','${ctx}/csm/expNameDict/info');"
                               method="post" class="form-inline">
                      <input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/>
                      <input id="pageSize" name="pageSize" type="hidden"
                             value="${page.pageSize}"/>
                      <label>消耗品代码:</label><form:input path="expCode" htmlEscape="false"
                                                     maxlength="50" class="form-control"/>
                      &nbsp;&nbsp;</br><label>消耗品名称:</label><form:input path="expName"
                                                                      htmlEscape="false"
                                                                      maxlength="50"
                                                                      class="form-control"/>
                      &nbsp;<input id="btnSubmit" class="btn btn-primary" type="submit" value="查询"/>
                    </form:form>
                  </div>
                </div>

                <%--消耗品名称列表--%>
                <div class="container-fluid">
                  <table id="contentTable1" class="table table-bordered mg-t datatable">
                    <thead>
                    <tr>
                      <th>消耗品代码</th>
                      <th>消耗品名称</th>
                    </tr>
                    </thead>
                    <tbody>
                    <c:forEach items="${page.list}" var="expNameDict">
                    <tr onclick="loadDiv('rigthCenterDiv','${ctx}/csm/expInfo/index?expDict.expCode=${expNameDict.expCode}')">
                      <td> ${expNameDict.expCode}</td>
                      <td> ${expNameDict.expName}</td>
                    </tr>
                    </c:forEach>
                  </table>
                  <div class="pagination">${page}</div>
                </div>
              </div>
            </div>
          </section>
        </div>
      </div>
    </section>

    <section class="main-content col-lg-8">
      <div class="content-wrap" id="rigthCenterDiv">
        <div class="wrapper" style="bottom: 50px;">
          <ul class="nav nav-tabs">
            <li class="active">
              <a href="#"   onclick="loadDiv('rigthCenterDiv','${ctx}/csm/expInfo/index')">消耗品基本信息列表</a>
            </li>
            <li>
              <a href="#" onclick="vilidateRows()">消耗品基本信息添加</a>
            </li>
          </ul>
        </div>
      </div>
    </section>
  </div>
</div>
<script>
  function vilidateRows() {
    var table = document.getElementById("contentTable1");//获取表格元素
    var allTrs = table.getElementsByTagName("tr");//获取表格的行元素
    if (allTrs.length == 0) {
      return;
    }
    for(var i=0;i< allTrs.length;i++){
      var tr= allTrs[i];
      if(hasClass(tr,'table-selected')){
        loadDiv('rigthCenterDiv', '${ctx}/csm/expDict/form');
      }
    }
    toastr.error("请先选择消耗品名称字典！");
    //判断某个元素是否有指定的样式
    function hasClass(element, cls) {
      return (' ' + element.className + ' ').indexOf(' ' + cls + ' ') > -1;
    }
  }
</script>